<template>
    <popup
        ref="popupRef"
        width="35%"
        title='地址编辑'
        class="bg-page"
        :showClose="false"
        :showFooter="false"
    >
        <el-form ref="formRef" :model="formData" class="mb-12" label-width="150px">
            
            <el-form-item label="年份" prop="yearCode" clearable>
                <el-select class="w-60" v-model="formData.yearCode" placeholder="请选择年份">
                    
                    <el-option v-for="(item) in yearList"
                               :label="item"
                               :value="item"/>
                </el-select>
            </el-form-item>
            
            
            <el-form-item label="一月" prop="january">
                <el-input class="w-60" v-model="formData.january" placeholder="请输入一月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="二月" prop="february">
                <el-input class="w-60" v-model="formData.february" placeholder="请输入二月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="三月" prop="march">
                <el-input class="w-60" v-model="formData.march" placeholder="请输入三月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="四月" prop="april">
                <el-input class="w-60" v-model="formData.april" placeholder="请输入四月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="五月" prop="may">
                <el-input class="w-60" v-model="formData.may" placeholder="请输入五月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="六月" prop="june">
                <el-input class="w-60" v-model="formData.june" placeholder="请输入六月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="七月" prop="july">
                <el-input class="w-60" v-model="formData.july" placeholder="请输入七月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="八月" prop="august">
                <el-input class="w-60" v-model="formData.august" placeholder="请输入八月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="九月" prop="september">
                <el-input class="w-60" v-model="formData.september" placeholder="请输入九月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="十月" prop="october">
                <el-input class="w-60" v-model="formData.october" placeholder="请输入十月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="十一月" prop="november">
                <el-input class="w-60" v-model="formData.november" placeholder="请输入十一月份的数据" clearable/>
            </el-form-item>
            <el-form-item label="十二月" prop="december">
                <el-input class="w-60" v-model="formData.december" placeholder="请输入十二月份的数据" clearable/>
            </el-form-item>
        
        </el-form>
        
        <div class=" flex justify-end pr-16">
            <el-button @click="handleClose">
                取消
            </el-button>
            
            <el-button @click="handleConfirm" type="primary">
                确定
            </el-button>
        </div>
    </popup>


</template>

<script lang='ts' setup>


import Popup from "@/components/popup/index.vue";
import {UnwrapNestedRefs} from "@vue/reactivity";
import {FormInstance} from "element-plus";
import {useAfterSaleEnumManager} from "@/manager/base/AfterSaleEnumManager";
import CrmLogisticsDataDTO from "@/api/logistics/dto/CrmLogisticsDataDTO";
import {yearList} from "@/config/enums/crm/comment";
import {onMounted, reactive, shallowRef} from "vue";
import IdRequest from "@/api/baisc/IdRequest";
import {getLogisticsDataInfo} from "@/api/logistics/CrmLogisticsDataController";

let afterSaleOrderConfig = useAfterSaleEnumManager();
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const formRef = shallowRef<FormInstance>()


// 定义地址数据
const formData: UnwrapNestedRefs<CrmLogisticsDataDTO> = reactive(new CrmLogisticsDataDTO())


function open(id: number) {
    let idRequest = new IdRequest();
    idRequest.id = id
    getLogisticsDataInfo(idRequest).then(i => {
        Object.assign(formData, i)
    }).then(popupRef.value?.open())
    popupRef.value?.open()
}


async function handleConfirm() {
    popupRef.value.close()
    emit('confirm', formData)
}


function handleClose() {
    popupRef.value.close()
}


const emit = defineEmits(['confirm', 'close'])
defineExpose({
    open
})


</script>

